{% extends "meetup_group_frame.html" %}
{% load location_filter %}
{% block title %}
加入相聚小组----新生活从此开始!
{% endblock %}

{% block custom_header %}
<!-- CommentBoard stuff-->

<script type="text/javascript" src="/static/js/jquery.form.js"></script>
<script type="text/javascript" src="/static/js/meetup_charsets.js"></script>

<script type="text/javascript"> 
  var boardId = {{meetup.comment_board.id}};
</script>

<script type="text/javascript"> 
  $(function(){
    $("form #rsvpForm").submit(function() {
       $(":submit",this).attr("disabled", "disabled");
     });
  });
</script>


<!--<link href="/static/css/floatdialog.css" rel="stylesheet" type="text/css" />-->
<link href="/static/commentboard/cb_style.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="/static/css/jquery-ui.css" type="text/css"/>
<script type="text/javascript" src="/static/js/jquery-ui.js"></script>
<script type="text/javascript" src="/static/js/meetup_meetup_details.js"></script>
<script type="text/javascript" src="/static/js/meetup_meetup_modify.js"></script>
<script type="text/javascript" src="/static/commentboard/commentboard.js"></script>



{% endblock %}

{% block content %}

<!-- start content of the page-->
<div id="C_page">
	
	
	<div id="C_pageDividerBlock"></div>

	<div id="C_contextHead">
		<div id="C_contextHeadBody">
			<div id="C_contextTitle">
				<a href="/group/{{meetup.group.id}}/" class="url">
					<span id="bannerGroupName" class="fn org">{{meetup.group.name}}</span>
				</a>

				{% if creator %} 

				
				{% endif %}	
				
			</div>
		</div>
	</div>

	<div id="C_pageBody">
		<div id="C_context">
		<div id="C_document" class="" style="margin:0 0 0 0;">
			<div class="D_docsection divby7">
				
				<!-- first column -->
				<DIV class="D_col D_docCol spans5 first">
					
					<!-- first column body -->
					<DIV class=D_colbody>
				
						<!-- start of D_box -->
						<DIV class=D_box> 
							<DIV class=D_boxbody> 
								<DIV class=D_boxhead> 
									<div id="C_contextTitle">
										<SPAN class="D_info m_topic_field" style="font-size:2em;font-weight:bold">{{meetup.topic}}</SPAN> 
										{% if creator %} 
											<button id="edit_meetup" class="ui-button ui-state-default ui-corner-all">编辑</button>
											
											
											<div id="dialog" title="更新活动信息。。。" style="display:none">
												<b><p id="validateTips" >在下方输入要修改的信息</p></b>
												<form id="m_update_form" method="post">
													

													<fieldset>
														<div class="D_boxsection">
														<label><b>聚会主题:</b></label>
															<input id="m_update_topic" style="width: 18em! important; margin-bottom:0.5em;" name="topic" value="{{meetup.topic}}" class="text ui-widget-content ui-corner-all locNameUpdateName" type="text">						
														<br><label><b>活动地点:</b></label>
															<input id="m_update_address" style="width: 18em ! important; margin-bottom:0.5em;" name="address" value="{{meetup.address}}" maxlength="60" class="text ui-widget-content ui-corner-all locNameUpdateName" type="text">
														
																
														<br><label><b>活动时间:</b></label>
															<div>
															<div class="inlineForm locMenu" id="locMenu" title="">
															  <div class="D_form_compact" id="formLocation">
															  
																<div class="element coPicker" style="margin-left:2.5em;"> 
																<label for="from">从：</label>
																  <span class="input">
																	 <input id="date_from" name="date_from" class="ui-widget-content ui-corner-all" style="width: 100px ! important;" value="{{meetup.time_from|date:"m/d/Y"}}" maxlength="20" type="text">
																  </span>
																</div>
																<div id="locPicker" class="element">
																	<div id="locSwitchable">
																	  <label for="time" >时间：</label>
																	  <span id="m_update_time_from"  value="{{meetup.time_from|date:"H:i"}}">
																		  <select name="time_from" id="time_from"  class="ui-widget-content ui-corner-all">
																			<option value=00:00>00:00</option>
																			<option value=00:30>00:30</option>
																			<option value=01:00>01:00</option>
																			<option value=01:30>01:30</option>
																			<option value=02:00>02:00</option>
																			<option value=02:30>02:30</option>
																			<option value=03:00>03:00</option>
																			<option value=03:30>03:30</option>
																			<option value=04:00>04:00</option>
																			<option value=04:30>04:30</option>
																			<option value=05:00>05:00</option>
																			<option value=05:30>05:30</option>
																			<option value=06:00>06:00</option>
																			<option value=06:30>06:30</option>
																			<option value=07:00>07:00</option>
																			<option value=07:30>07:30</option>
																			<option value=08:00>08:00</option>
																			<option value=08:30>08:30</option>
																			<option value=09:00>09:00</option>
																			<option value=09:30>09:30</option>
																			<option value=10:00>10:00</option>
																			<option value=10:30>10:30</option>
																			<option value=11:00>11:00</option>
																			<option value=11:30>11:30</option>
																			<option value=12:00>12:00</option>
																			<option value=12:30>12:30</option>
																			<option value=13:00>13:00</option>
																			<option value=13:30>13:30</option>
																			<option value=14:00>14:00</option>
																			<option value=14:30>14:30</option>
																			<option value=15:00>15:00</option>
																			<option value=15:30>15:30</option>
																			<option value=16:00>16:00</option>
																			<option value=16:30>16:30</option>
																			<option value=17:00>17:00</option>
																			<option value=17:30>17:30</option>
																			<option value=18:00>18:00</option>
																			<option value=18:30>18:30</option>
																			<option value=19:00>19:00</option>
																			<option value=19:30>19:30</option>
																			<option value=20:00>20:00</option>
																			<option value=20:30>20:30</option>
																			<option value=21:00>21:00</option>
																			<option value=21:30>21:30</option>
																			<option value=22:00>22:00</option>
																			<option value=22:30>22:30</option>
																			<option value=23:00>23:00</option>
																			<option value=23:30>23:30</option>
																		  </select>
																	  </span>
																	</div>
																</div>
															  </div>
																			  
															<div class="D_form_compact" id="formLocation">
																<div class="element coPicker"style="margin-left:2.5em;"> 
																	<label for="to">到：</label>
																	<span class="input">
																		<input id="date_to" name="date_to" style="width: 100px ! important;" class="ui-widget-content ui-corner-all"  value="{{meetup.time_to|date:"m/d/Y"}}" maxlength="20" type="text">
																	</span>
																</div>
																<div id="locPicker" class="element">
																	<div id="locSwitchable">
																		<label for="时间" >时间：</label>
																		<span id="m_update_time_to"  value="{{meetup.time_to|date:"H:i"}}">
																			<select name="time_to" id="time_to" class="ui-widget-content ui-corner-all">
																				<option value=00:00>00:00</option>
																				<option value=00:30>00:30</option>
																				<option value=01:00>01:00</option>
																				<option value=01:30>01:30</option>
																				<option value=02:00>02:00</option>
																				<option value=02:30>02:30</option>
																				<option value=03:00>03:00</option>
																				<option value=03:30>03:30</option>
																				<option value=04:00>04:00</option>
																				<option value=04:30>04:30</option>
																				<option value=05:00>05:00</option>
																				<option value=05:30>05:30</option>
																				<option value=06:00>06:00</option>
																				<option value=06:30>06:30</option>
																				<option value=07:00>07:00</option>
																				<option value=07:30>07:30</option>
																				<option value=08:00>08:00</option>
																				<option value=08:30>08:30</option>
																				<option value=09:00>09:00</option>
																				<option value=09:30>09:30</option>
																				<option value=10:00>10:00</option>
																				<option value=10:30>10:30</option>
																				<option value=11:00>11:00</option>
																				<option value=11:30>11:30</option>
																				<option value=12:00>12:00</option>
																				<option value=12:30>12:30</option>
																				<option value=13:00>13:00</option>
																				<option value=13:30>13:30</option>
																				<option value=14:00>14:00</option>
																				<option value=14:30>14:30</option>
																				<option value=15:00>15:00</option>
																				<option value=15:30>15:30</option>
																				<option value=16:00>16:00</option>
																				<option value=16:30>16:30</option>
																				<option value=17:00>17:00</option>
																				<option value=17:30>17:30</option>
																				<option value=18:00>18:00</option>
																				<option value=18:30>18:30</option>
																				<option value=19:00>19:00</option>
																				<option value=19:30>19:30</option>
																				<option value=20:00>20:00</option>
																				<option value=20:30>20:30</option>
																				<option value=21:00>21:00</option>
																				<option value=21:30>21:30</option>
																				<option value=22:00>22:00</option>
																				<option value=22:30>22:30</option>
																				<option value=23:00>23:00</option>
																				<option value=23:30>23:30</option>
																			</select>
																		</span>
																	</div>
																</div>
															</div>
															
															</div>
															</div>
														
							
															<label><b>动员的话：</b></label><br>
															<textarea style="width: 20em ! important; height: 6em; margin-left:2.5em;" id="m_update_description" name="description" value="{{meetup.description}}" class="ui-widget-content ui-corner-all">{{meetup.description}}</textarea>
														</div>
														<div class="D_boxsection">
															<input id="notify_all" type="checkbox" style="margin-left:3em;" name="notify_others" value="true" class="ui-widget-content ui-corner-all checkbox"><span style="margin-left:1em; color:#D22A2C;"><b>发邮件通知参与者?</b></span>
														</div>
													</fieldset>
												</form>
											</div>
										{% endif %}
									</div>
								</DIV>
								<!-- end of D-boxhead-->
								
								<!-- start of boxsection-->
									<div class="D_boxsection">
									    <div class="D_eventSummary">
									        <div class="D_eventDate">
									            <div class="D_tearSheet">
									                <div class="date">
									                    <span class="month">{{ meetup.time_from|date:"m月" }}</span>
									                    <span class="day">{{ meetup.time_from|date:"d" }}</span>
									                </div>
									                <div class="daytime">
									                    <span class="dow" id="dow_cn">{{ meetup.time_from|date:"w" }}</span>
									                    <span class="time">{{ meetup.time_from|date:"H:i" }}</span>
									                </div>
									            </div>
									        </div>
									        <div class="D_eventStats">
									            <div class="D_boxcols divby2">
									                <div class="D_col first">
									                    <div class="D_colbody">
									                        <dl class="stats">
									                            <dt class="statLabel">
									                            	碰头地点
									                            </dt>
									                            <dd class="meetupLoc">
									                            	{% if joined %}
									                                <div>
																		<span class="m_location">{{ meetup.address}}</span>
									                                </div>
																	{% else %}
																	<div  class="D_empty">
																		碰头地点只有群组用户可见，如果您已经是该群组的成员，请登录查看。
																	</div>
																	{% endif %}
									                                <p style="margin-top: 1em;">
									                                    <b> 碰头结束时间</b>
									                                    <br/><span class="to_datetime">{{meetup.time_to|date:"H:i,y年m月d日"}}</span>
									                                </p>
																	
									                            </dd>
									                        </dl>
									                    </div>
									                </div>
									                <div class="D_col last">
									                    <div class="D_colbody">
									                        <dl class="stats">
									                            <dt>
									                            	谁会来？
									                            </dt>
									                            <dd class="D_meetupAttendees">
									                                <div>
									                                    <span class="D_yes">{{definite_users|length}} 确定</span>
									                                    / <span class="D_maybe">{{undecided_users|length}} 未定</span>
									                                    / <span class="D_no">{{refused_users|length}} 不去 </span>
									                                </div>
									                                <p style="margin-top: 1em;">
									                                    <b> 发起人</b>
									                                    <br/>
									                                    <a href="/accounts/profile/?uid={{meetup.group.creator.id}}">{{meetup.group.creator.profile.name}}</a>
									                                </p>
									                            </dd>
									                        </dl>
									                    </div>
									                </div>
									            </div>
									        </div>
									    </div>
									</div>
									<!-- end of box section -->
									
									<!-- start of D_boxsection-->
									<DIV class=D_boxsection> 
										<DIV class=groupDesc>
											<P><span class="m_description_field">{{ meetup.description }} </span></P>
										</DIV>
                  </DIV>
                  <!-- end of D_boxsection -->

                  <!-- start of D_boxsection-->
                  <DIV class=D_boxsection>
                    <script type="text/javascript" src="/static/commentboard/cb_content.js"></script>	
                  </DIV>
                  <!-- end of D_boxsection-->

									
									<!-- start of D_boxfoot-->
									<!--<DIV class=D_boxfoot><A href="/about/">了解更多信息</A> </DIV>-->
									<!-- end of D_boxfoot-->
								</DIV> 
								<!-- end of D_boxbody-->
							</DIV> 
							<!-- end of D_box -->

							<!-- need insert from here -->
				
					</DIV>
					<!-- end of first column body-->
					
				</DIV>
				<!-- end of first column-->

					<!-- the last column-->
					
					<DIV class="D_col D_docCol spans2 last IE_lastCol">
						<DIV class=D_colbody>
							<DIV class="D_box">
								<DIV class=D_boxbody>
									<DIV class=organizer style="text-align:center;">
										<DIV class=value>
                      <a href="/group/{{meetup.group.id}}/">
			                <img src="{{meetup.group.picture.url}}" width=150><br>
											<STRONG>
												{{ meetup.group.name}} 
                      </STRONG>
                    </a>
										</DIV>
									</DIV>
								</DIV>
							</DIV>
							<DIV class="D_box calltoaction">
								<DIV class=D_boxbody>
									{% if joined and not pasted%}
										{% ifequal status -1 %}
									<div id="rsvpForm" class="D_boxsection" style="border-top: 0;">
										<form id="rsvp" name="rsvp" method="post" action="/group/{{ meetup.group.id}}/meetup/participate/">
											<div class="D_form">
												<div id="rsvpElement" class="element">
													<div class="label" id="willYouBeThere">
														<h2>您来碰头吗？</h2>
													</div>
													<div class="input">
														<fieldset class="rsvpResponse" id="D_rsvpChoose">
															<div class="inputs">
																<div>
																	<input type="radio" class="rsvp_choice_radio" id="response_yes" name="response" value="1"  style="display:inline"/>
																	<label for="response_yes" id="response_yes_label">我也去！</label>
																</div>
																<div>
																	<input type="radio" class="rsvp_choice_radio" id="response_no" name="response" value="2"  style="display:inline"/>
																	<label for="response_no" id="response_no_label">我去不了！</label>
																</div>
															</div>
														</fieldset>
													</div>
													<!--
													<div class="input" id="guestElement">
														<label id="guestLabel">我会带来 <input type="text" name="guests" id="guests" maxlength="2" size="2" value="0" style="display:inline" /> 位朋友</label>
													</div>
													-->
												</div>
												<div class="footElement">
													<input type="submit" id="rsvpSubmit" name="submitButton" value="我决定啦！" class="D_submit"  />
													<input type="hidden" name="meetup_id" value="{{meetup.id}}"/>
												</div>
												<input type="hidden" name="reminder" value="1" />
												<input type="hidden" name="real_action" value="rsvp" />
											</div>
										</form>
									</div>
									{% else %}
									<DIV class=D_boxhead>
                    					<H2>欢迎回来，<br>{{ user.profile.name }} </H2>
									{% ifequal status 0 %}
										<P>注意碰头时间，千万别忘了准时参加啊！</P>
										{% else %} {% ifequal status 1 %}
										<!--user rejected to join this meet up-->
										<P>谢谢您的关注，以后会有更好的活动，下次一定来啊！</P>
										{% endifequal %}{% endifequal %}
										<form id="cancel_join" name="cancel" method="post" action="/group/{{meetup.group.id}}/meetup/cancel_join/">
											<div class="D_form">
												<div class="footElement">
													<input type="submit" id="cancelSubmit" name="cancelButton" value="我改主意啦！" class="D_submit"  />
													<input type="hidden" name="meetup_id" value="{{meetup.id}}"/>
												</div>
											</div>
										</form>
									</DIV>
									{% endifequal %}
										
									{% else %}{% if joined and pasted%}
									<DIV class=D_boxhead>
										{% ifequal status 0%}
										<H2>您参加了这次碰头。。。</H2>
										<p>感谢您的参与，还有很多精彩活动呵！</p>
										{%else%} 
										<H2>这次碰头已经不能参加了。。。</H2>
										<P>错过了机会？没关系，瞅瞅其他碰头吧！</P>
										{% endifequal%}
									</DIV>
									{% else %}
									<DIV class=D_boxhead>
										<H2>还等什么？</H2>
										<P>您将在新的聚会开始时收到邀请！</P>
									</DIV>
									{% endif %}{% endif %}
									
									<!-- start D_boxsection-->
									<DIV class=D_boxsection>
										
										
										<!-- start of the register form-->
										{% if anonymous %}
										<FORM action="/accounts/login/" method="post">
										{% else %}
										<form action="/groups/join/" method="post">
										{% endif %}
											{%if anonymous %}
											<!-- start of D_form_short D_form-->
											<DIV class="D_form_short D_form">
												<DIV class=element>
													<DIV class=label><LABEL>邮件:</LABEL> </DIV>
													<DIV class=input><INPUT class=text id=emailInput name=email> </DIV>
												</DIV>
												
												<DIV class=element>
													<DIV class=label><LABEL>密码:</LABEL> </DIV>
													<DIV class=input><INPUT class=text id=passwordInput type=password name=password> </DIV>
												</DIV>
												 <input type=hidden value="北京" name="city" />
												 <input type=hidden value="海淀区" name="district" />
												
												{% endif %}
							
												<!-- start footElement-->
												
												{% if not joined %}
												<DIV class=footElement>
													<INPUT class="D_submit T_button" type=submit value="加入我们!" name=submitButton> 
													<input type=hidden value="{{ meetup.group.id }}" name="group_id" />
													<input type=hidden value="{{ user.id }}" name="user_id" />
												</DIV>
												<!-- end of D_form_short D_form-->
												{% endif %}
							
											</DIV>
											<!-- end of the form_short div-->
										</FORM>
										<!-- end of the form-->
									</DIV>
									<!-- end of D_boxsection-->
								</DIV>
								<!-- end of D_boxbody-->
							</DIV>
							<!-- end of D_box calltoaction-->
	
							
							
							
              <DIV class="D_box calltoaction">
                <DIV class="D_boxbody">
                  <DIV class="D_boxhead">
                    <h2>谁会参与?</h2>
                  </DIV> <!-- end of D_boxhead -->

                  <DIV class="D_boxsection">
                    <div class="D_yes"><span>{{definite_users|length}}</span> 确定</div> 
                   	<DIV class="D_boxcols divby3" style="text-align:center">
									<!-- found place --> 
									    {% for user in definite_users %}
									      <DIV class="D_col"> 
      										<DIV class=D_colbody> 
			    								<dl>
					    						<dt>
                          <a href="/accounts/profile/?uid={{user.id}}"> 
                            	<img src="{{user.profile.photo.url}}" width="60" height="60">
                          </a>
											    </dt>
											    <dd>
                            <a href="/accounts/profile/?uid={{user.id}}"><strong>{{user.profile.name}}</strong></a>
											    </dd>
					    						</dl>
						    				</DIV>
							    		</DIV> 
                    {% endfor %}	
							    	</DIV>


                    <div class="D_maybe"><span>{{undecided_users|length}}</span> 未定</div> 
                   	<DIV class="D_boxcols divby3" style="text-align:center">
									<!-- found place --> 
									    {% for user in undecided_users %}
									      <DIV class="D_col"> 
      										<DIV class=D_colbody> 
			    								<dl>
					    						<dt>
                          <a href="/accounts/profile/?uid={{user.id}}"> 
                            	<img src="{{user.profile.photo.url}}" width="60" height="60">
                          </a>
											    </dt>
											    <dd>
                            <a href="/accounts/profile/?uid={{user.id}}"><strong>{{user.profile.name}}</strong></a>
											    </dd>
					    						</dl>
						    				</DIV>
							    		</DIV> 
                    {% endfor %}	
							    	</DIV>


                    <div class="D_no"><span>{{refused_users|length}}</span> 不去</div> 
                   	<DIV class="D_boxcols divby3" style="text-align:center">
									<!-- found place --> 
									    {% for user in refused_users %}
									      <DIV class="D_col"> 
      										<DIV class=D_colbody> 
			    								<dl>
					    						<dt>
                          <a href="/accounts/profile/?uid={{user.id}}"> 
                            	<img src="{{user.profile.photo.url}}" width="60" height="60">
                          </a>
											    </dt>
											    <dd>
                            <a href="/accounts/profile/?uid={{user.id}}"><strong>{{user.profile.name}}</strong></a>
											    </dd>
					    						</dl>
						    				</DIV>
							    		</DIV> 
                    {% endfor %}	
							    	</DIV>

									</DIV> 

                  </DIV> <!-- end of D_boxsection -->
                </DIV> <!-- end of D_boxbody -->
              </DIV> <!-- end of D_box calltoaction -->
					
						</DIV><!-- end of col_body-->
					</DIV><!-- end of IE_lastCol-->
					
				</DIV><!-- end of divide by 7-->
				
			</DIV><!-- end of document-->
		
	</DIV><!-- end of context-->
		
	</DIV><!-- end of page body -->

</DIV><!-- end of C_page, class=vcard-->

{% endblock %}
